<template>
  <div class="main_box" style="padding:10px">
    <div class="detail_wrap">
      <div class="tit">
        <h2>基础信息</h2>
        <el-button type="success" plain size="small" icon="fa fa-mail-forward" @click="returnList">返回</el-button>
      </div>
      <div class="con">
        <ul>
          <li>
            <label class="label">标本箱编号:</label>
            <span>{{dataInfo.boxCode}}</span>
          </li>
          <li>
            <label class="label">标本箱名称:</label>
            <span>{{dataInfo.boxName}}</span>
          </li>
        </ul>
      </div>

      <div class="tit">
        <h2>温控设备信息</h2>
      </div>
      <div class="con">
        <ul>
          <li>
            <label class="label">设备编号:</label>
            <span>{{dataInfo.equipCode}}</span>
          </li>
          <li>
            <label class="label">设备名称:</label>
            <span>{{dataInfo.equipName}}</span>
          </li>
          <li>
            <label class="label">设备温度:</label>
            <span>{{dataInfo.equipTemperature}}</span>
          </li>
          <li>
            <label class="label">设备湿度:</label>
            <span>{{dataInfo.equipHumidity}}</span>
          </li>
          <li>
            <label class="label">设备位置:</label>
            <span>{{dataInfo.equipAddr}}</span>
          </li>
          <li>
            <label class="label">剩余电量:</label>
            <span>{{dataInfo.equipPower}}</span>
          </li>
          <li>
            <label class="label">设备状态:</label>
            <span>{{dataInfo.equipStatus}}</span>
          </li>
          <li>
            <label class="label">设备类型:</label>
            <span>{{dataInfo.equipType}}</span>
          </li>
          <li>
            <label class="label">设备最新上报时间:</label>
            <span>{{dataInfo.latestTime}}</span>
          </li>
        </ul>
      </div>

      <div class="tit" v-if="fromType == 2">
        <h2>温控上报信息  &nbsp;&nbsp;&nbsp; <el-button  plain type="success" icon="el-icon-folder" @click="handleClickExport">导出数据</el-button></h2>
      </div>
      <div class="con" v-if="fromType == 2">

        <el-row ref="tableRow">
          <!-- 列表 -->
          <el-table :data="dataList"  :fit="true" highlight-current-row>
            <el-table-column type="index" label="序号" width="50"></el-table-column>
            <el-table-column prop="latestTime" label="最新上报时间"></el-table-column>
            <el-table-column label="温度报警范围" width="120">
              <template slot-scope="scope">
                <span>{{scope.row.temperatureMinWarn}}</span> - <span>{{scope.row.temperatureMaxWarn}}</span>
              </template>
            </el-table-column>
            <el-table-column prop="equipTemperature" label="设备温度"></el-table-column>
            <el-table-column prop="equipHumidity" label="设备湿度"></el-table-column>
            <el-table-column prop="equipPower" label="剩余电量"></el-table-column>
            <el-table-column prop="equipStatus" label="设备状态"></el-table-column>
            <el-table-column prop="equipAddr" label="设备位置"></el-table-column>
            <el-table-column prop="createDate" label="创建时间"  width="180"></el-table-column>
          </el-table>
        </el-row>
      </div>

    </div>
  </div>
</template>

<script>
import EquipApi from '@/api/equip/equip';
export default {
  data() {
    return {
      dataInfo: "",
      dataList: [],
      fromType: 1
    };
  },
  methods: {
    getData(type) {
      if (type == 1){
        this.fromType = 1;
        EquipApi.getEquipSpecimenInfo({
          esId: this.$route.query.id
        }).then(res => {
          this.dataInfo = res.data;
        });
      }else{
        this.fromType = 2
        this.getDataUsage()
        this.getDataRecord()
      }
    },
    getDataUsage() {
      EquipApi.getSpecimenUsage({
        syUserId: this.$route.query.id
      }).then(res => {
        this.dataInfo = res.data;
      });
    },
    getDataRecord() {
      EquipApi.getEquipTemperatureRecords({
        reportId: this.$route.query.reportId
      }).then(res => {
        this.dataList = res.data;
      });
    },
    handleClickExport(){
      if (!this.dataList || this.dataList.length < 1){
        this.$Utils.notifyError("暂无数据，无法导出");
        return
      }
      // 导出，获取到pfd路径
      EquipApi.exportEquipTemperatureRecords({
        syUserId: this.$route.query.id,
        reportId: this.$route.query.reportId
      }).then(res => {
        if (res.data){
          window.open(res.data,"_blank");
          //this.$Utils.downloadFile(res.data,"温控设备导出数据");
        }
      });
    },
    formatDate(value) {
      return this.$Utils.formatDate(value, "yyyy-MM-dd");
    },
    returnList() {
      if(this.fromType == 1){
        this.$store.dispatch('delView', this.$route);
        this.$router.push({ path: "/equip/specimenManagement" });
      }else if(this.fromType == 2){
        this.$store.dispatch('delView', this.$route);
        this.$router.push({ path: "/report/reportManagement" });
      }
    }
  },
  /*mounted() {
    console.log("--------wrwree-------"+this.fromType)
    this.getData(this.fromType);
  },*/
  beforeRouteEnter(to,from,next){
    next(vm => {
      if (from.path == '/equip/specimenManagement') {
        vm.getData(1);
      }else if (from.path == '/report/reportManagement') {
        vm.getData(2);
      }
    })

    /*if(from.path == '/equip/specimenManagement'){
      this.getData(1);
    }
    if (from.path == '/report/reportManagement'){
      this.getData(2);
    }*/
  }
};
</script>
<style lang="scss" src="@/assets/css/views/Detail.scss" scope>
</style>
